<template>
  <view class="services">
    <view class="top" @click="back">
      <uv-navbar title="服务介绍" height="44px" titleStyle="{font-weight: bold;font-size: 1.1rem;}"></uv-navbar>
    </view>
    <!-- 服务 -->

    <view class="photo">
      <view class="one">
        <image :src='list.cover' mode=""></image>
      </view>
      <view class="two">
        <view class="two-left">￥<view class="color">{{ list.price }}</view>
        </view>
        <view class="two-right">{{list.offers}}</view>
      </view>
      <view class="three">{{list.num}}</view>
    </view>
    <!-- 服务介绍 -->
    <view class="introduced">
      <view class="head">服务介绍</view>
      <view class="center">
        <image :src="list.image" mode=""></image>
      </view>
      <view class="bottom">
        <view class="bottom-left">高品质标准</view>
        <view class="bottom-left">HANBIXIONGSHIPIN</view>
      </view>
    </view>
    <!-- 盒子 -->
    <view class="box"></view>
    <!-- 下单 -->
    <view class="place">
      <view class="left">
        <view class="left1">
          <image src="../../static/image/客服.png" mode=""></image>
        </view>
        <view class="left2">客服</view>
      </view>
      <view class="right">
        <uv-button type="primary" color="#008c8c" shape="circle" text="立即下单"></uv-button>
      </view>
    </view>
  </view>
</template>

<script setup>
  import {
    ref
  } from 'vue';
  import {
    onLoad
  } from '@dcloudio/uni-app';
  import {
    uniRequest
  } from "../../utils/request.js"

  const list = ref('')
  //
  onLoad((e) => {
    const id = JSON.parse(e.id)
    console.log(id)
    uniRequest('More/list?server=1', function(err, data) {
      if (err) {
        // 错误
        console.log(err)
      } else {
        console.log('"成功了"', data)
        list.value = data
      }
    }, 'POST', {
      id: id
    });
  })
  const back = (() => {
    uni.navigateBack({
      delta: 1, // 返回1个，如果是2，返回2个页面
    });
  })
</script>

<style>
  @import url('../../pages/services/services.css');
</style>